<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>百度地图API的使用</title>
    <!-- 百度地图API-->
    <script src="http://api.map.baidu.com/api?v=2&ak=krcIhmBvA1idu6G6Aiu3LGLoRczb9CfN" type="text/javascript"></script>
    <script type="text/javascript">
        function initialize() {
            //创建地图实例
            var map = new BMap.Map('map');
            //创建一个坐标
            var point = new BMap.Point(121.433759, 28.659658);
            //地图初始化，设置中心点坐标和地图级别
            map.centerAndZoom(point, 15);
            map.addControl(new BMap.MapTypeControl());
            //添加控件，地图类控件
            map.enableScrollWheelZoom();
            //启用滚轮放大缩小
            map.enableContinuousZoom();
            //启用地图惯性拖拽。
            var marker = new BMap.Marker(point);
            //创建标注
            map.addOverlay(marker);
            //将标注添加到地图
            var infoWindow = new BMap.InfoWindow("I am here");
            //创建信息窗口
            map.openInfoWindow(infoWindow, point);
            //开启信息窗口

        }
        window.onload = initialize;

    </script>
    <style type="text/css">
        #map {
            margin: 0 auto;
            height: 600px;
            width: 1200px;
        }
    </style>
</head>

<body>
    <!-- 百度地图地图容器-->
    <div id="map"></div>
</body>

</html>